<template>
  <qf-card
    className="userCreate"
    title="权限创建"
    btnTitle="返回"
    btnUrl="/auth"
  >
    <qf-form :width="140" :formItem="formItem" :formBtns="formBtns"></qf-form>
  </qf-card>
</template>

<script>
import { getAuthApi, postAuthApi } from "@/api/auth";

export default {
  async created() {
    const auths = await getAuthApi();
    this.formItem[2].payload = auths.data.map((item) => {
      return {
        label: item.auth_name,
        value: item.auth_id + "_" + item.auth_name,
      };
    });
    // console.log(auths.data);
  },
  data() {
    // 1 验证规则
    // 2 返回数据
    return {
      // 表单配置
      formItem: [
        // ...
        {
          label: "权限名称",
          rules: [],

          field: "auth_name",

          placeholder: "请输入权限名称",
          type: "input",
        },
        {
          label: "权限后期访问地址",
          rules: [],

          field: "url",

          placeholder: "请输入权限后期访问地址，例如 /test",
          type: "input",
        },
        {
          label: "所属权限",
          field: "tmp",
          rules: [],

          placeholder: "请选择所属权限",
          type: "select",
          payload: [
            // { label: "后台首页", value: "1_后台首页" },
            // { label: "分类管理", value: "2_分类管理" },
            // { label: "门店管理", value: "3_门店管理" },
          ],
        },
        {
          label: "是否缓存组件",
          field: "keep_alive",
          rules: [],

          placeholder: "请选择是否缓存组件",
          type: "select",
          payload: [
            { label: "缓存", value: "1" },
            { label: "不缓存", value: "0" },
          ],
        },
        {
          label: "权限组件路径",
          rules: [],
          field: "component",

          placeholder: "请输入权限组件路径（直接src/views具体路径）",
          type: "input",
        },
        // ...
      ],
      // 表单按钮组
      formBtns: [
        {
          content: "创建",
          type: "primary",
          click: async (formData) => {
            // 假 - 创建的是顶级权限
            // 真 - 创建的是子级权限
            if (formData.tmp) {
              formData.auth_pid = formData.tmp.split("_")[0];
              formData.auth_pname = formData.tmp.split("_")[1];
            }
            // console.log("表单数据", formData);
            const res = await postAuthApi(formData);
            if (res.meta.state === 201) {
              this.$message.success(res.meta.msg);
              this.jump("/auth");
            } else {
              this.$message.error(res.meta.msg);
            }
          },
        },
        {
          content: "重置",
          type: "",
        },
      ],
    };
    // ....
  },
};
</script>

<style></style>
